<!doctype html>
<html>
    <head>
        <meta charset="utf-8">
        <title>test</title>
    </head>
    <body>
        <form>
            <fieldset> <!--如何调整边框的大小-->
            <legend>个人信息</legend>

            <p>   <!--姓名-->
           <span>名字</span>: <input type="text" name="user_name" size="10">
            </p>

            <p>
              <!--性别-->
                 <span>性别:</span><br/>
                 <input type="radio" name="sex" value="male" checked/ id="male"/><label for="male">male</label><br/>
                <input type="radio" name="sex" value="female" id="female"/><label for="female">female</label>
            </p>
           <p>
               <!--出生日期-->
               <span>选择出生日期</span>
               <input type="date" name="your"/>
           </p>
            <p>
                <!--爱好-->
                <span>爱好:</span><br/>
                <input type="checkbox" name="like" value="game">Game<br/>
                <input type="checkbox" name="like" value="ball">Ball<br/>
                <input type="checkbox" name="like" value="other">Other<br/>
            </p>
            <p>
            <!--地址-->
                <span>地址:</span><br/>
                <select name="address">
                    <option value="广东">广东</option>
                    <option value="湖南">湖南</option>
                    <option value="广东">广东</option>
                    <option value="湖南">湖南</option>
                </select>
                <select name="address">
                        <option value="广东">广东</option>
                        <option value="湖南">湖南</option>
                        <option value="广东" selected>广东</option> <!--预约广东-->
                        <option value="湖南">湖南</option>
                </select>
            </p>
            <p>
            <!--国籍-->
                <span>输入国籍:</span><br/>
                <input list="country" name="country">
                <datalist id="country">
                    <option value="China"></option>
                    <option value="USA"></option>
                </datalist>
            </p>
            <p>
            <!--自我介绍-->
                <textarea rows="10" cols="30">自我介绍</textarea>
            </p>
            <p>
                <span>输入你的邮箱</span>    
                <input type="email" name="gmail"/>
            </p>
            <p>
                <span>填写验证码</span><input type="text">
            <!--获取验证码-->
                <input type="button" value="发送验证码" onclick="alert('已发送')">
            </p>
            <p>
                <textarea rows="10" cols="30" readonly>仔细阅读以下规则</textarea>
            </p>

            <p>            
                <input type="submit" value="提交">
                <pre>                 </pre>
                <input type="reset" value="重置" ><!--如何对重置的样式进行修改-->
            </p>

        </fieldset>
        </form>

        
    </body>
</html>